interface Options {
  el: string
}

export default function (options: Options): Promise<{ baseUrl: string }> {
  const { promise, resolve } = Promise.withResolvers()

  onMounted(() => {
    const img: HTMLImageElement = document.querySelector(options.el) as HTMLImageElement

    img.onload = () => {
      const baseUrl = base64(img)
      resolve({
        baseUrl
      })
    }
  })

  // 图片转base64
  const base64 = (el: HTMLImageElement) => {
    const canvas = document.createElement('canvas')
    const ctx = canvas.getContext('2d')

    canvas.width = el.width
    canvas.height = el.height
    ctx?.drawImage(el, 0, 0, el.width, el.height)

    return canvas.toDataURL('image/jpg')
  }

  return promise as Promise<{ baseUrl: string }>
}